// 背景颜色
@backColor: #EDF1F7;
@fontColor: #fff;
@boxShadow: 3px 0px 10px 3px rgb(235, 226, 226);

* {
    margin: 0;
    padding: 0;
}
ul,
ol {
    list-style: none;
}
a {
    text-decoration: none;
}
body {
    background-color: @backColor;
}
/* 顶部区域开始 */
/* 顶部标题区域开始 */
.top {
    display: flex;
    flex-direction: column;
    align-items: center;
    background-image: url("https://course.myhope365.com/img/index-top-bg.564836d0.png");
    background-size: 100% 100%;
    height: 300px;
    // overflow: hidden;
    /* 天亮logo */
    .logo {
        margin: 50px 0 90px;
        width: 1160px;
        text-align: center;
        > img {
            width: 212px;
            height: 68px;
        }
    }
    .top_list {
        display: flex;
        width: 1106px;
        margin: 0 auto;
        /* 导航栏 */
        nav {
            width: 300px;
        }
        nav > ul > li {
            float: left;
            padding-right: 20px;
        }
        nav > ul > li > a {
            font-size: 16px;
            color: @fontColor;
            font-weight: 700;
            text-decoration: none;
        }
        .pull-down {
            position: absolute;
            background-color: #fff;
            width: 130px;
            display: none;
            z-index: 999;
        }
        .pull-down li {
            width: 100%;
            height: 30px;
            line-height: 30px;
            transition: all .3s;
        }
        .pull-down li:hover {
            background-color: rgb(195, 227, 212);
        }
        .pull-down a {
            color: #0b0b0b;
            font-size: 14px !important;
            margin-left: 10px;
        }
        .inDown {
            position: absolute;
            top: 250px;
            left: 1233px;
            z-index: 9999;
            background-color: #fff;
            width: 95px;
            text-align: center;
            box-shadow: 0px 1px 1px 2px rgba(215, 213, 213, .4);
            display: none;
            ul {
                margin-bottom: 0;
                li {
                    padding: 10px 0;
                    color: #9F9F9F;
                    font-size: 14px;
                }
                li:hover {
                    background-color: rgba(136, 255, 217, 0.4);
                    color: green;
                }
            }
        }
    }
  }
/* 搜索框 */
.search {
    float: left;
    margin-left: 120px;
    margin-right: 15px;
    input {
        padding-left: 20px;
        border-radius: 50px;
        border: 0;
        width: 250px;
        height: 38px;
        outline: 0;
    }
    input::placeholder {
        color: #cfcbcb;
        font-size: 15px;
    }
    button {
        position: absolute;
        margin-left: 0;
        top: 0.1px;
        right: -4px;
        border: 1px solid #cfcbcb;
        border-radius: 50px;
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
        line-height: 38px;
        background-color: #53CFD4;
        width: 50px;
        height: 38px;
        img {
            margin-top: 9px;
            vertical-align: top;
        }
    }
}
/* 购物车 */
.car_in {
    display: flex;
    justify-content: flex-end;
    height: 36px;
    .car {
        border-radius: 25px;
        background-color: #fff;
        text-align: center;
        line-height: 45px;
        width: 36px;
        height: 36px;
        img {
            vertical-align: baseline;
        }
    }
}
/* 登录注册按钮 */
.in {
    > button {
        position: relative;
        top: -38px;
        left: 20px;
        border: 0;
        border-radius: 25px;
        background-color: #fff;
        color: #35C7DE;
        width: 94px;
        height: 30px;
    }
    /* 开通VIP免费观看全站视频 */
    > .tips {
        position: relative;
        font-size: 10px;
        top: -45px;
        right: 10px;
        width: 155px;
        height: 41px;
        text-align: center;
        line-height: 30px;
        font-weight: 500;
        color: @fontColor;
        background-image: url("");
    }
    .userIn {
        align-items: center;
        margin-top: -10px;
        width: 200px;
        .userImg {
            position: relative;
            top: 5px;
            width: 32px;
            height: 32px;
            line-height: 32px;
            font-size: 16px;
            img {
                display: block;
                width: 100%;
                height: 100%;
                border-radius: 100%;
            }
        }
        .userName {
            position: relative;
            top: 7px;
            left: -40px;
            font-weight: 600;
            margin-left: 9px;
            font-size: 13px;
            color: #fff;
            width: 56px;
            height: 42px;
            line-height: 21px;
        }
        .userVip {
            position: absolute;
            left: -20px;
            font-weight: 600;
            color: #ab753f;
            font-size: 14px;
            width: 80px;
            height: 21px;
            line-height: 21px;
            img {
                width: 16px;
                height: 13px;
            }
        }
    }
}
/* 顶部标题区域结束 */
/* 轮播图标题区域开始 */
.swiper {
    position: relative;
    margin-top: -40px;
    margin-bottom: 25px;
    border-radius: 8px;
    border: 15px solid #fff;
    width: 1160px;
    height: 432px;
    background-color: #fff;
    z-index: 0;
    .swiper-slide {
        background-size: 100% 100%;
        border-radius: 10px;
        background-position: 50%;
        overflow: hidden;
    }
    .bt {
        color: rgba(0, 0, 0, 0)!important;
    }
    .swBut_prev,
    .swBut_next{
        position: absolute;
        top: 45%;
    }
    .swBut_next{
        right: -10px;
    }
}  
/* 轮播图标题区域结束 */
/* 仅需198即可观看所有付费课程开始 */
.money {
    margin: 0 auto;
    width: 1160px;
    background: url("https://course.myhope365.com/img/vip-line.f590fe35.png");
    > .center {
        margin: auto;
        display: flex;
        justify-content: center;
        align-items: center;
        width: 400px;
        height: 50px;
        > img {
            margin-right: 8px;
            vertical-align: baseline;
            width: 30px;
            height: 23px;
        }
        > button {
            margin-left: 8%;
            border: 0;
            border-radius: 50px;
            width: 72px;
            height: 26px;
            font-weight: 600;
            color: #fff;
            font-size: 14px;
            background-color: #6E421A;
        }
    }
}
/* 仅需198即可观看所有付费课程结束 */
/* 顶部标题区域结束 */
/* 主体内容区域开始 */
.broadcast {
    display: flex;
    margin: 25px auto;
    border-radius: 15px;
    width: 1160px;
}
.broadcast_1 {
    margin-right: 15px;
    padding: 20px 10px;
    border-radius: 15px;
    background-color: #fff;
    width: 670px;
    height: 663px;
    .br_title {
        /* width: 630px; */
        margin-left: 20px;
        height: 39px;
    }
}
.broadcast_2 {
    padding: 20px 10px;
    border-radius: 15px;
    background-color: #fff;
    width: 474px;
    height: 663px;
    .br_title {
        /* width: 630px; */
        margin-left: 20px;
        height: 39px;
    }
}
/* 直播课程  课程榜单 */
.br_title {
    display: flex;
    > .img {
        width: 38px;
        img {
            width: 38px;
            height: 38px;
        }
    }
    > .title > h2 {
        margin: 0 10px;
        text-align: center;
        line-height: 39px;
        width: 104px;
        height: 39px;
        font-size: 25px;
        font-weight: 700;
    }
    p {
        text-align: center;
        line-height: 42px;
        font-size: 14px;
        color: #9F9F9F;
    }
    .tow_img {
        display: flex;
        align-items: center;
        margin-left: 270px;
        > img {
            margin-right: 10px;
            width: 20px;
            height: 20px;
        }
    }
}
/* 课程内容 */
.content {
    display: flex;
    flex-direction: column;
}
.course {
    margin: auto;
    margin-left: 8px;
    border: 1px solid #cfcbcb;
    border-radius: 15px;
    box-shadow: @boxShadow;
    overflow: hidden;
    width: 305px;
    height: 262px;
    .text,
    p {
        margin-top: 10px;
        margin-left: 20px;
    }
    p {
        font-size: 14px;
        color: #9F9F9F;
    }
    .text > b {
        font-size: 14px;
    }
    p > img {
        margin-top: 3px;
        margin-right: 5px;
        vertical-align: top;
    }
}
.content_top,
.bottom {
    display: flex;
    flex-direction: row;
    margin-top: 20px;
}
.course_img > img {
    width: 305px;
    height: 180px;
}
/* 榜单 */
.list {
    margin: 25px auto;
    border-radius: 15px;
    
    box-shadow: @boxShadow;
    width: 420px;
    height: 540px;
    .list_img {
        width: 434px;
        > img {
            margin-top: -19px;
            padding-left: 155px;
            box-sizing: content-box;
            width: 140px;
            height: 60px;
        }
    }
    button {
        margin: 20px 150px;
        border-radius: 50px;
        background: linear-gradient(90deg,#fd952d,#f1534b);
        border: 0;
        width: 108px;
        height: 29px;
        color: #fff;
    }
}
.cx {
    display: flex;
    align-items: flex-end;
    margin-top: 10px;
    margin-left: 20px;
    margin-bottom: 30px;
    .cx_img > img {
        border-radius: 10px;
        width: 170px;
        height: 100px;
    }
    > .text {
        margin-left: 10px;
        > p:first-child {
            font-size: 14px;
        }
        > p:last-child {
            font-size: 14px;
            color: #9F9F9F;
        }
        .eight {
            margin-top: 25px;
            font-size: 20px;
            color: red;
        }
        *{
            margin-bottom: 0;
        }
    }
}
/* 免费课程 */
/* 免费内容*/
.free {
    display: flex;
    flex-direction: column;
    margin: 25px auto;
    border-radius: 15px;
    background-color: #fff;
    width: 1160px;
    height: 330px;
    .free_title {
        display: flex;
        line-height: 50px;
        margin: 30px 10px 10px;
        border-bottom: 2px solid rgb(235, 226, 226);
        height: 50px;
        .free_img {
            img {
                margin-right: 5px;
                vertical-align: baseline;
                width: 38px;
                height: 38px;
            }
        }
        .more {
            margin-left: 925px;
            color: #9F9F9F;
            img {
                width: 16px;
                height: 16px;
            }
            a {
                color: #9F9F9F;
            }
        }
        h2 {
            margin-left: 10px;
            margin-top: 5px;
            margin-bottom: 0;
            font-size: 25px;
            font-weight: 700;
        }
    }
    .free_content {
        display: flex;
        justify-content: center;
        .free_img {
            overflow: hidden;
            width: 215px;
            height: 118px;
            img {
                width: 215px;
                height: 118px;
                transition: all 1s;
            }
            img:hover {
                margin:-10px 0 0 -10px;
                width: 245px;
                height: 148px;
            }
        } 
        .free_text {
            font-size: 12px;
        }
        .free_div {
            margin: 0 6px;
            margin-top: 8px;
            box-shadow: @boxShadow;
            border-radius: 10px;
            overflow: hidden;
            width: 215px;
            height: 205px;
            .text > * {
                margin-left: 10px;
                margin-bottom: 5px;
            }
            p {
                font-size: 14px;
                white-space: nowrap;
                /* 溢出隐藏 */
                overflow: hidden;
                /* 添加省略号 */
                text-overflow: ellipsis;
            }
            .free_p {
                font-size: 16px;
                color: #00CF8C;
            }
            .free_pp {
                color: #9F9F9F;
            }
            .free_content {
                display: flex;
            }
        }
    } 
}
.premium {
    display: flex;
    flex-direction: column;
    margin: 25px auto;
    border-radius: 15px;
    background-color: #fff;
    width: 1160px;
    height: 330px;
    .premium_title {
        display: flex;
        line-height: 50px;
        margin: 30px 10px 10px;
        border-bottom: 2px solid rgb(235, 226, 226);
        height: 50px;
        .premium_img {
            img {
                margin-right: 5px;
                vertical-align: baseline;
                width: 38px;
                height: 38px;
            }
        }
        .vip_img {
            img {
                margin-top: 5px;
                margin-left: 10px;
                vertical-align: baseline;
                width: 93px;
                height: 33px;
            }
        }
        .more {
            margin-left: 815px;
            color: #9F9F9F;
            img {
                width: 16px;
                height: 16px;
            }
            a {
                color: #9F9F9F;
            }
        }
        h2 {
            margin-left: 10px;
            margin-top: 5px;
            margin-bottom: 0;
            font-size: 25px;
            font-weight: 700;
        }
    }
    .premium_content {
        display: flex;
        justify-content: center;
        .premium_img {
            overflow: hidden;
            width: 215px;
            height: 118px;
            img {
                width: 215px;
                height: 118px;
                transition: all 1s;
            }
            img:hover {
                width: 245px;
                height: 148px;
            }
        } 
        .premium_text {
            font-size: 12px;
        }
        .premium_div {
            margin: 0 6px;
            margin-top: 8px;
            box-shadow: @boxShadow;
            border-radius: 10px;
            overflow: hidden;
            width: 215px;
            height: 205px;
            .text > * {
                margin-left: 10px;
                margin-bottom: 5px;
            }
            p {
                font-size: 14px;
                white-space: nowrap;
                /* 溢出隐藏 */
                overflow: hidden;
                /* 添加省略号 */
                text-overflow: ellipsis;
            }
            .premium_p {
                font-size: 16px;
                color: #00CF8C;
            }
            .premium_pp {
                color: #9F9F9F;
            }
            .premium_content {
                display: flex;
            }
        }
    } 
}
.discount {
    display: flex;
    flex-direction: column;
    margin: 25px auto;
    border-radius: 15px;
    background-color: #fff;
    width: 1160px;
    height: 330px;
    .discount_title {
        display: flex;
        line-height: 50px;
        margin: 30px 10px 10px;
        border-bottom: 2px solid rgb(235, 226, 226);
        height: 50px;
        .discount_img {
            img {
                margin-right: 5px;
                vertical-align: baseline;
                width: 38px;
                height: 38px;
            }
        }
        .vip_img {
            img {
                margin-top: 5px;
                margin-left: 10px;
                vertical-align: baseline;
                width: 93px;
                height: 33px;
            }
        }
        .more {
            margin-left: 770px;
            color: #9F9F9F;
            img {
                width: 16px;
                height: 16px;
            }
            a {
                color: #9F9F9F;
            }
        }
        h2 {
            margin-left: 10px;
            margin-top: 5px;
            margin-bottom: 0;
            font-size: 25px;
            font-weight: 700;
        }
    }
    .discount_content {
        display: flex;
        justify-content: center;
        .discount_img {
            overflow: hidden;
            width: 215px;
            height: 118px;
            img {
                width: 215px;
                height: 118px;
                transition: all 1s;
            }
            img:hover {
                width: 245px;
                height: 148px;
            }
        } 
        .discount_text {
            font-size: 12px;
        }
        .discount_div {
            margin: 0 6px;
            margin-top: 8px;
            box-shadow: @boxShadow;
            border-radius: 10px;
            overflow: hidden;
            width: 215px;
            height: 205px;
            .text > * {
                margin-left: 10px;
                margin-bottom: 5px;
            }
            p {
                font-size: 14px;
                white-space: nowrap;
                /* 溢出隐藏 */
                overflow: hidden;
                /* 添加省略号 */
                text-overflow: ellipsis;
            }
            .discount_p {
                font-size: 16px;
                color: #00CF8C;
            }
            .discount_pp {
                color: #9F9F9F;
            }
            .discount_content {
                display: flex;
            }
            .ant-tag {
                margin: 0;
                margin-left: 24px;
                padding: 0 7px;
                display: inline-block;
                height: 22px;
                font-size: 12px;
                line-height: 20px;
                border: 1px solid #d9d9d9;
                border-radius: 2px;
                cursor: pointer;
                opacity: 1;
                font-weight: 500;
                color: #fa8c16;
                background: #fff7e6;
                border-color: #ffd591;
            }
        }
    } 
}
.front_page {
    display: flex;
    flex-direction: column;
    margin: 25px auto;
    border-radius: 15px;
    background-color: #fff;
    width: 1160px;
    height: 280px;
    .front_title {
        display: flex;
        line-height: 50px;
        margin: 30px 10px 10px;
        border-bottom: 2px solid rgb(235, 226, 226);
        height: 50px;
        .front_img {
            img {
                margin-right: 5px;
                vertical-align: baseline;
                width: 38px;
                height: 38px;
            }
        }
        .vip_img {
            img {
                margin-top: 5px;
                margin-left: 10px;
                vertical-align: baseline;
                width: 93px;
                height: 33px;
            }
        }
        .more {
            margin-left: 920px;
            color: #9F9F9F;
            img {
                width: 16px;
                height: 16px;
            }
            a {
                color: #9F9F9F;
            }
        }
        h2 {
            margin-left: 10px;
            margin-top: 5px;
            margin-bottom: 0;
            font-size: 25px;
            font-weight: 700;
        }
    }
    .front_content {
        display: flex;
        justify-content: center;
        .front_img {
            overflow: hidden;
            width: 215px;
            height: 118px;
            img {
                width: 215px;
                height: 118px;
                transition: all 1s;
            }
            img:hover {
                width: 245px;
                height: 148px;
            }
        } 
        .front_text {
            font-size: 12px;
        }
        .front_div {
            margin: 0 6px;
            margin-top: 8px;
            box-shadow: @boxShadow;
            border-radius: 10px;
            overflow: hidden;
            width: 215px;
            height: 156px;
            .text > * {
                margin-left: 10px;
                margin-bottom: 5px;
                text-align: center;
                line-height: 36px;
            }
            p {
                font-size: 14px;
                white-space: nowrap;
                /* 溢出隐藏 */
                overflow: hidden;
                /* 添加省略号 */
                text-overflow: ellipsis;
            }
        }
    } 
}
/* 主体内容区域结束 */
/* 测导航与底部 */
footer {
    margin-top: 20px;
    width: 100%;
    height: 197px;
    background-color: #0F141A;
    .ftbox {
        margin: 0 auto;
        box-sizing: border-box;
        padding: 20px 0;
        line-height: 30px;
        width: 1160px;
        height: 197px;
        p {
            text-align: center;
            color: #777878;
            font-size: 14px;
        }
    }
    .ft1 {
        margin: 16px auto;
        box-sizing: border-box;
        width: 51%;
        color: #fff;
        font-size: 22px;
    }
    .ft2 {
        ul {
            margin-left: 260px;
            overflow: hidden;
            width: 600px;
        }
        li {
            margin-left: 40px;
            float: left;
            a {
                color: #777878;
                font-size: 14px;
            }
        }
    }
    .ft3 {
        margin: 25px auto 10px auto;
        background-color: #545454;
        border: 1px solid #545454;
        height: 1px;
        width: 1000px;
    }
}
// 测导航
aside {
    position: fixed;
    right: 18px;
    top: 256px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    width: 50px;
    height: 195px;
    .customerService_1,
    .customerService_2,
    .customerService_3 {
        border-radius: 25px;
        background-color: #fff;
        width: 50px;
        height: 50px;
    }
    .customerService_1 {
        background-image: url("");
        background-repeat: no-repeat;
        background-size: 23px 27px;
        background-position: 50% 50%;
        cursor: pointer;
        box-shadow: 0 4px 10px rgba(0, 0, 0, .4);
        .a1p {
            text-align: center;
            line-height: 50px;
            display: none;
            color: rgb(48, 187, 142);
        }
    }
    .customerService_2 {
        position: relative;
        box-shadow: 0 4px 10px rgba(0, 0, 0, .4);
        background-image: url("../images/电话.png");
        background-repeat: no-repeat;
        background-size: 26px 26px;
        background-position: 50% 50%;
        cursor: pointer;
        .a2p {
            text-align: center;
            line-height: 50px;
            display: none;
            color: rgb(48, 187, 142);
        }
        .alert1 {
            position: absolute;
            right: 60px;
            top: -2px;
            border-radius: 10px;
            box-shadow: 0 4px 10px rgba(0, 0, 0, .4);
            display: none;
            width: 200px;
            height: 60px;
            background-color: #fff;
            p {
                margin-bottom: 0;
            }
            .a1p1 {
                text-align: center;
                font-size: 20px;
            }
            .a1p2 {
                margin: 0 auto;
                text-align: center;
                width: 200px;
                font-size: 18px;
                color: red;
            }
            .a1p2 img {
                left: 20px;
                bottom: 0px;
            }
        }
        .sanjiao1 {
            position: absolute;
            right: 41px;
            top: 18px;
            width: 0;
            height: 0;
            border-top: 10px solid transparent;
            border-left: 10px solid white;
            border-right: 10px solid transparent;
            border-bottom: 10px solid transparent;
            display: none;
        }
    }
    .customerService_3 {
        position: relative;
        box-shadow: 0 4px 10px rgba(0, 0, 0, .4);
        background-image: url("");
        background-repeat: no-repeat;
        background-size: 26px 26px;
        background-position: 50% 50%;
        cursor: pointer;
        .a3p {
            display: none;
            margin: 0 auto;
            margin-top: 10px;
            text-align: center;
            line-height: 15px;
            width: 40px;
            color: rgb(48, 187, 142);
        }
        .alert2 {
            position: absolute;
            right: 60px;
            top: -2px;
            width: 200px;
            height: 60px;
            background-color: #fff;
            border-radius: 10px;
            box-shadow: 0 4px 10px rgba(0, 0, 0, .4);
            display: none;
            p {
                margin-bottom: 0;
            }
            .a1p1 {
                text-align: center;
                font-size: 20px;
            }
            .a1p2 {
                margin: 0 auto;
                text-align: center;
                width: 200px;
                font-size: 18px;
                color: red;
            }
            .a1p2 img {
                left: 20px;
                bottom: 0px;
            }
        }
        .sanjiao2 {
            width: 0;
            height: 0;
            border-top: 10px solid transparent;
            border-left: 10px solid white;
            border-right: 10px solid transparent;
            border-bottom: 10px solid transparent;
            position: absolute;
            right: 41px;
            top: 18px;
            display: none;
        }
    }
}
.customerService_1:hover .a1p {
    display: block;
}
.customerService_1:hover {
    background-image: none;
}
.customerService_2:hover .a2p {
    display: block;
}
.customerService_2:hover {
    background-image: none;
}
.customerService_2:hover .alert1 {
    display: block;
}
.customerService_2:hover .sanjiao1 {
    display: block;
}
.customerService_3:hover .a3p {
    display: block;
}
.customerService_3:hover {
    background-image: none;
}
.customerService_3:hover .alert2 {
    display: block;
}
.customerService_3:hover .sanjiao2 {
    display: block;
}
// 吸顶
.box_ceiling {
    position: fixed;
    top: 0;
    left: 0;
    visibility: hidden;
    width: 100%;
    height: 80px;
    background-color: #fff;
    .ceiling_top {
        display: flex;
        margin: 0 auto;
        width: 1200px;
        text-align: center;
        .ceiling_top_list {
            display: flex;
            width: 1106px;
            margin: 0 auto;
            .pull-down {
                position: absolute;
                top: 60px;
                left: 80px;
                background-color: #fff;
                width: 130px;
                display: none;
                z-index: 999;
                box-shadow: @boxShadow;
                line-height: 80px;
            }
            .pull-down li {
                width: 100%;
                height: 30px;
                line-height: 30px;
            }
            .pull-down li:hover {
                background-color: rgb(195, 227, 212);
            }
            .pull-down a {
                color: #676161;
                font-size: 14px !important;
                margin-left: 10px;
                font-weight: 400;
            }
            nav {
                line-height: 80px;
                ul {
                    display: flex;
                }
            } 
            nav > ul > li {
                margin-left: 20px;
                a {
                    color: black;
                    font-size: 16px;
                    font-weight: 700;
                }
            }
            /* 搜索框 */
            .search {
                float: left;
                margin-left: 176px;
                margin-right: 15px;
                line-height: 80px;
                input {
                    padding-left: 20px;
                    border-radius: 50px;
                    border: 1px solid rgb(230, 226, 226);
                    width: 250px;
                    height: 38px;
                    outline: 0;
                }
                input::placeholder {
                    color: #cfcbcb;
                    font-size: 15px;
                }
                button {
                    position: absolute;
                    margin-left: 0;
                    top: 21.9px;
                    right: -13px;
                    border: 1px solid #cfcbcb;
                    border-radius: 50px;
                    border-top-left-radius: 0;
                    border-bottom-left-radius: 0;
                    line-height: 38px;
                    background-color: #53CFD4;
                    width: 50px;
                    height: 37px;
                    img {
                        margin-top: 9px;
                        vertical-align: top;
                    }
                }
            }
            /* 购物车 */
            .ceiling_car_in {
                display: flex;
                justify-content: flex-end;
                height: 36px;
                .car {
                    position: relative;
                    top: 22px;
                    border-radius: 25px;
                    background-color: #fff;
                    text-align: center;
                    line-height: 45px;
                    box-shadow: @boxShadow;
                    border-radius: 50%;
                    width: 36px;
                    height: 36px;
                    img {
                        vertical-align: baseline;
                    }
                }
            }
            .goin {
                position: relative;
                top: 23px;
                left: 25px;
                width: 94px;
                height: 30px;
                button {
                    text-align: center;
                    border: 0;
                    border-radius: 25px;
                    background-color: #fff;
                    box-shadow: @boxShadow;
                    color: black;
                    width: 94px;
                    height: 30px;
                }
                .userIn {
                    align-items: center;
                    margin-top: -12px;
                    width: 200px;
                    .userImg {
                        position: relative;
                        top: 9px;
                        width: 32px;
                        height: 32px;
                        line-height: 32px;
                        font-size: 16px;
                        img {
                            display: block;
                            width: 100%;
                            height: 100%;
                            border-radius: 100%;
                        }
                    }
                    .userName {
                        position: relative;
                        top: 7px;
                        left: -39px;
                        font-weight: 600;
                        margin-left: 9px;
                        font-size: 13px;
                        color: black;
                        width: 56px;
                        height: 42px;
                        line-height: 21px;
                    }
                    .userVip {
                        position: absolute;
                        top: 16px;
                        left: 50px;
                        font-weight: 600;
                        color: #ab753f;
                        font-size: 14px;
                        width: 80px;
                        height: 21px;
                        line-height: 21px;
                        img {
                            width: 16px;
                            height: 13px;
                        }
                    }
                }
            }
            .topDown {
                position: fixed;
                top: 68px;
                left: 1293px;
                z-index: 9999;
                background-color: #fff;
                width: 95px;
                text-align: center;
                box-shadow: 0px 1px 1px 2px rgba(215, 213, 213, .4);
                ul {
                    margin-bottom: 0;
                    li {
                        padding: 10px 0;
                        color: #9F9F9F;
                        font-size: 14px;
                    }
                    li:hover {
                        background-color: rgba(136, 255, 217, 0.4);
                        color: green;
                    }
                }
            }
        }
        .logo {
            margin: 50px 0 90px;
            width: 1160px;
            text-align: center;
            line-height: 80px;
            > img {
                width: 212px;
                height: 68px;
            }
        }
        .ceiling_logo {
            line-height: 80px;
        }
    }
}
// 登录注册
.userIn {
    display: flex;
    margin: auto;
    margin-top: -15px;
    div {
        margin: auto;
        // margin-right: 10px;
        text-align: center;
        line-height: 47px;
        width: 141px;
        height: 47px;
    }
}
.modal-body {
    padding: 0;
    padding-top: 15px;
}
.form-control {
    width: 100%;
    height: 32px;
}
.register {
    margin-right: 141px;
}
.href_a {
    font-size: 14px;
    color: #9F9F9F;
}
#register {
    top: 66px;
    left: 75px;
}
.btnIn {
    text-align: center;
    line-height: 15px;
}
.btnIn_1 {
    margin-top: 25px;
    text-align: center;
    line-height: 15px;
}
.form-group {
    margin-bottom: 0;
    input {
        padding-left: 30px;
    }
    input::placeholder {
        color: #cfcbcb;
        font-size: 14px;
    }
    img {
        position: relative;
        top: 28px;
        left: 10px;
    }
    .input_user {
        margin-top: -25px;
    }
    .input_pow {
        margin-top: 10px;
        // .verification {
        //     width: 158px;
        // }
        button {
            position: relative;
            top: -32px;
            left: 171px;
            border-radius: 5px;
            border: 0;
            background-color: #00CF8C;
            color: #fff;
            width: 115px;
            height: 32px;
        }
    }
}
.color_text {
    color: #00CF8C;
    border-bottom: 2px solid #00CF8C;
}
.user:hover,
.pow:hover {
    color: #00CF8C;
    border-bottom: 2px solid #00CF8C;
}
